Skip to content

fix: add explicit type annotations to fix Fresh Install Tests CI#2815

Merged
nperez0111 merged 1 commit into
mainfrom
fresh-install-fixes-1
Jun 1, 2026
Merged

fix: add explicit type annotations to fix Fresh Install Tests CI#2815
nperez0111 merged 1 commit into
mainfrom
fresh-install-fixes-1

Conversation

@nperez0111
Copy link
Copy Markdown
Contributor

@nperez0111 nperez0111 commented Jun 1, 2026

Problem

The Fresh Install Tests CI workflow (failing run) updates production dependencies to their latest semver-compatible versions before building. When @ariakit/react updated its internal module structure (from @ariakit/react-core to @ariakit/react-components), contextual typing from external library component props broke, causing TS7006: Parameter implicitly has an 'any' type errors.

Fix

Add explicit type annotations to 5 callback parameters that relied on external library types for inference:

File Parameter Type Added
packages/ariakit/src/panel/Panel.tsx:35 activeId string | null | undefined
packages/ariakit/src/toolbar/ToolbarButton.tsx:49 e MouseEvent<HTMLButtonElement>
packages/ariakit/src/panel/PanelFileInput.tsx:27 e ChangeEvent<HTMLInputElement>
packages/ariakit/src/badge/Badge.tsx:39 event MouseEvent<HTMLButtonElement>
packages/xl-ai/src/components/AIMenu/AIMenuController.tsx:73 event MouseEvent

All annotations use React/DOM built-in types rather than library-specific types, making them resilient to future dependency updates.

Verification

Full fresh install simulation was run locally:

  1. pnpm install (from lockfile)
  2. pnpm update --prod (for all published packages — simulates fresh user install)
  3. pnpm dedupe
  4. pnpm run build0 errors
  5. pnpm run test27/27 targets succeeded

Summary by CodeRabbit

  • Refactor
    • Improved type safety across component event handlers in Badge, Panel, PanelFileInput, ToolbarButton, and AIMenuController components.
    • Enhanced type consistency in callback and event parameter declarations.

…ual typing

When @ariakit/react updates its internal module structure (e.g. from
@ariakit/react-core to @ariakit/react-components), contextual typing
from external library component props can break, causing TS7006
'Parameter implicitly has an any type' errors in the Fresh Install
Tests CI workflow.

Add explicit type annotations to 5 callback parameters that depend on
external library types for inference:

- packages/ariakit/src/panel/Panel.tsx: setActiveId callback
- packages/ariakit/src/toolbar/ToolbarButton.tsx: onMouseDown callback
- packages/ariakit/src/panel/PanelFileInput.tsx: onChange callback
- packages/ariakit/src/badge/Badge.tsx: onClick callback
- packages/xl-ai/src/components/AIMenu/AIMenuController.tsx: outsidePress callback

All annotations use React/DOM built-in types (MouseEvent, ChangeEvent)
rather than library-specific types, making them resilient to future
dependency updates.
@vercel
Copy link
Copy Markdown

vercel Bot commented Jun 1, 2026

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
blocknote Ready Ready Preview Jun 1, 2026 1:46pm
blocknote-website Ready Ready Preview Jun 1, 2026 1:46pm

Request Review

@coderabbitai
Copy link
Copy Markdown
Contributor

coderabbitai Bot commented Jun 1, 2026

Review Change Stack

📝 Walkthrough

Walkthrough

Five components receive explicit TypeScript type annotations for event handlers and callbacks: Badge's onClick handler, Panel's setActiveId callback parameter, PanelFileInput's onChange handler, ToolbarButton's onMouseDown handler, and AIMenuController's outsidePress event parameter. No functional logic changes.

Changes

Event Handler Type Safety Improvements

Layer / File(s) Summary
Badge component click handler typing
packages/ariakit/src/badge/Badge.tsx
React import now includes MouseEvent type; onClick inline handler accepts typed MouseEvent<HTMLButtonElement> parameter.
Panel and PanelFileInput callback/handler typing
packages/ariakit/src/panel/Panel.tsx, packages/ariakit/src/panel/PanelFileInput.tsx
Panel's setActiveId callback parameter is typed as string | null | undefined; PanelFileInput's React import adds ChangeEvent and onChange handler is typed as ChangeEvent<HTMLInputElement>.
ToolbarButton onMouseDown handler typing
packages/ariakit/src/toolbar/ToolbarButton.tsx
React import includes MouseEvent type; Ariakit toolbar item's onMouseDown prop receives explicit MouseEvent<HTMLButtonElement> type annotation.
AIMenuController outsidePress handler typing
packages/xl-ai/src/components/AIMenu/AIMenuController.tsx
useFloatingOptions callback's outsidePress event parameter is explicitly typed as MouseEvent.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~8 minutes

Poem

🐰 Event handlers now declare their types with care,
MouseEvent, ChangeEvent—no ambiguity here!
Five components improved with annotations so clear,
TypeScript's gentle nudge makes intentions sincere. 🎯

🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check name Status Explanation
Title check ✅ Passed The title clearly and specifically describes the main change: adding explicit type annotations to fix CI failures, matching the actual changeset of typed callback parameters across five files.
Description check ✅ Passed The description provides a clear problem statement, detailed fix documentation, and verification results. While it doesn't follow the template structure, it includes all essential information for understanding and reviewing the changes.
Docstring Coverage ✅ Passed No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check ✅ Passed Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check ✅ Passed Check skipped because no linked issues were found for this pull request.

✏️ Tip: You can configure your own custom pre-merge checks in the settings.

✨ Finishing Touches
📝 Generate docstrings
  • Create stacked PR
  • Commit on current branch
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch fresh-install-fixes-1

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

@pkg-pr-new
Copy link
Copy Markdown

pkg-pr-new Bot commented Jun 1, 2026

Open in StackBlitz

@blocknote/ariakit

npm i https://pkg.pr.new/@blocknote/ariakit@2815

@blocknote/code-block

npm i https://pkg.pr.new/@blocknote/code-block@2815

@blocknote/core

npm i https://pkg.pr.new/@blocknote/core@2815

@blocknote/mantine

npm i https://pkg.pr.new/@blocknote/mantine@2815

@blocknote/react

npm i https://pkg.pr.new/@blocknote/react@2815

@blocknote/server-util

npm i https://pkg.pr.new/@blocknote/server-util@2815

@blocknote/shadcn

npm i https://pkg.pr.new/@blocknote/shadcn@2815

@blocknote/xl-ai

npm i https://pkg.pr.new/@blocknote/xl-ai@2815

@blocknote/xl-docx-exporter

npm i https://pkg.pr.new/@blocknote/xl-docx-exporter@2815

@blocknote/xl-email-exporter

npm i https://pkg.pr.new/@blocknote/xl-email-exporter@2815

@blocknote/xl-multi-column

npm i https://pkg.pr.new/@blocknote/xl-multi-column@2815

@blocknote/xl-odt-exporter

npm i https://pkg.pr.new/@blocknote/xl-odt-exporter@2815

@blocknote/xl-pdf-exporter

npm i https://pkg.pr.new/@blocknote/xl-pdf-exporter@2815

commit: 578c166

Copy link
Copy Markdown
Contributor

@coderabbitai coderabbitai Bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@packages/ariakit/src/panel/PanelFileInput.tsx`:
- Line 27: The onChange handler in PanelFileInput blindly accesses
e.target.files![0], which can be null and throw; update the handler in the
PanelFileInput component to guard the nullable files before indexing (e.g.,
check e.target.files and files.length or use optional chaining like
e.target.files?.[0]) and only call onChange?.(...) when a File exists, otherwise
do nothing or pass undefined as intended.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: fabd8535-c8a3-4e4e-abe9-d51bce6dc089

📥 Commits

Reviewing files that changed from the base of the PR and between f8b59e9 and 578c166.

📒 Files selected for processing (5)
  • packages/ariakit/src/badge/Badge.tsx
  • packages/ariakit/src/panel/Panel.tsx
  • packages/ariakit/src/panel/PanelFileInput.tsx
  • packages/ariakit/src/toolbar/ToolbarButton.tsx
  • packages/xl-ai/src/components/AIMenu/AIMenuController.tsx

accept={accept}
value={value ? value.name : undefined}
onChange={async (e) => onChange?.(e.target.files![0])}
onChange={async (e: ChangeEvent<HTMLInputElement>) => onChange?.(e.target.files![0])}
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue | 🟡 Minor | ⚡ Quick win

Guard nullable files before indexing.

e.target.files! can be null on some input states, which can throw at runtime when [0] is accessed.

Proposed fix
-        onChange={async (e: ChangeEvent<HTMLInputElement>) => onChange?.(e.target.files![0])}
+        onChange={async (e: ChangeEvent<HTMLInputElement>) => {
+          const file = e.target.files?.[0];
+          if (file) {
+            onChange?.(file);
+          }
+        }}
📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
onChange={async (e: ChangeEvent<HTMLInputElement>) => onChange?.(e.target.files![0])}
onChange={async (e: ChangeEvent<HTMLInputElement>) => {
const file = e.target.files?.[0];
if (file) {
onChange?.(file);
}
}}
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@packages/ariakit/src/panel/PanelFileInput.tsx` at line 27, The onChange
handler in PanelFileInput blindly accesses e.target.files![0], which can be null
and throw; update the handler in the PanelFileInput component to guard the
nullable files before indexing (e.g., check e.target.files and files.length or
use optional chaining like e.target.files?.[0]) and only call onChange?.(...)
when a File exists, otherwise do nothing or pass undefined as intended.

@nperez0111 nperez0111 merged commit faae3d5 into main Jun 1, 2026
23 of 26 checks passed
@nperez0111 nperez0111 deleted the fresh-install-fixes-1 branch June 1, 2026 13:48
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant